<!--
 File:      status.html
 Author:    Henry Feild
 Date:      29-Mar-2011
 Purpose:   This is the shell for a dynamically populated status page for the
            %%PROJECT_NAME%%.

%%VERSION%%
-->

<html>
<head>
    <link rel="shortcut icon" type="image/png"
        href="../css/img/crowdlogger-logo.001.16x16.png"/>
    <title>%%FULL_PROJECT_NAME%% Status Page</title>
    <link href="../css/dialog.css" rel="stylesheet" type="text/css">
    <link href="../css/clrm.css" rel="stylesheet" type="text/css">

    <!-- Load jQuery first. -->
    <script src="../js/external_lib/jquery.min.js"></script>
    
    <script src="../js/dialog.js"></script>
    <script src="../html-js/clrm-library.js"></script>
    <script src="../html-js/status.js"></script>


</head>
<body id="status_page_body">
<span class="hidden" id="init"></span>
<div class="bodyWrapper">

    <!-- The header. -->
    <div class="header">
        <div class="title with-logo"> 
            <span class="logo-version version titleSub">version %%VERSION%%</span>
            <img class="logo" src="../css/img/crowdlogger-logo.002.png"/>
            <span class="titleMain">Status page</span>
        </div>
    </div>
    
    <div style="clear: both;"></div>
    <div class="headerBuffer"></div>

    <div id="update_message" class="update_message hidden">

        %%PROJECT_NAME%% has been updated to <span
name="version_no"></span>. 
<a name="whatsnew" href="#" id="whatsnew">Click here</a> 
to see what's new in this version of %%PROJECT_NAME%%. 
<br>
Please take a look at the <a
href="#notifications">notifications section</a> to be aware of and address any
outstanding issues concerning %%FULL_PROJECT_NAME%%.
        
    </div>

    <div id="content" class="content">
   
        <!-- Columns to hold the tiles (gets populated after 
             everything has rendered). -->
        <div id="left-column"></div>
        <div id="right-column"></div>
 
        <!-- Notifications. -->
        <div id="notifications-wrapper" class="notifications section" style="display: none;">
            <a name="notifications"></a>
            <h1>Notifications</h1>
            <table id="notifications" class="notifications">

            </table>
        </div>
    
    
        <!-- Messages. -->
        <div class="messages section">
            <a name="messages"></a>
            <h1>Recent Messages</h1>
            <div id="messages">
    
            </div>
        </div> 
   
        <!-- Tools. -->
        <div class="tools section">
            <a name="tools"></a>
            <h1>Tools</h1>
            <div id="tools">

            <ul>

                <!-- Settings. -->
                <li title="Modify your settings." id="settings_button">Settings</li>

                <!-- Register. -->
                <li title="Register or update your registration." id="register_button">Register</li>

                <!-- Search histogram. -->
                <li title="See the searches you have entered and how frequently. You can sort by search or frequency." id="search_histogram_button">Search histogram</li>


                 <!-- Search trails. -->
<!--                <li title="See the searches you have conducted and pages you've visited in chronological order." id="search_trails_button">Search trails</li>
 -->

                <!-- Export search log. -->
                <li title="View your raw search log and save it to disk." id="export_log_button">View browsing log</li>


                <!-- Clear log. -->
                <li title="Remove everything&mdash;all of your searches, visited pages, etc.&mdash;from your search log." id="clear_log_button">Clear entire log
                <button id="clear_log_confirm_button" class="confirm" style="display:none">Confirm delete</button>
                <span id="cleared" style="display: none" class="cleared">Cleared</span>
                </li>


                <!-- Apps and studies. -->
                <li title="Manage new and existing apps and studies" id="app-library-button">Install apps &amp; studies</li>

                <li title="View the available development tools." id="launch_dev_tools" style="display: none;">Development tools</li>
            </ul>

            </div>
        </div>

        <!-- Apps. -->
        <div id="apps" class="apps section">
            <a name="apps"></a>
            <h1>Apps</h1>


        </div>

        <!-- Studies. -->
        <div id="studies" class="studies section">
            <a name="studies"></a>
            <h1>Studies</h1>

        </div>

        <!-- Feedback. -->
        <div class="feedback section">
            <a name="feedback"></a>
            <h1>Feedback</h1>
            If you have any comments or suggestions about the %%PROJECT_NAME%%
            system that you would like to let us know, you can
            email us at %%CONTACT_EMAIL%% or  <a href="#"
            id="feedback_button">leave an anonymous message at this web
            page</a>.
            
        </div> 
        <p>
    </div>

    <!-- Templates. -->
    <div class="templates">
        <!-- Notifications -->
        <table>
        <tr id="notification">
            <td class="alert"></td>
            <td>
                <div data-type="message"></div>
                <div data-type="buttons"></div>
            </td>
        </tr>
        </table>

        <button id="notification-button"></button>

        <!-- CLRMs -->
        <div id="clrm-template" class="clrm-container">
            <div class="clrm app" data-id="clrm">
                <span class="ribbon installed enabled">installed</span>
                <span class="ribbon installed not-enabled">disabled</span>
                <img data-id="logo" alt="" src=""/>
                <span class="name" data-id="name"></span>
            </div>
            <div class="access">
                <div class="message" data-id="message">
                No messages.
                </div>

                <button class="installed enabled" data-type="open">Open</button>
                <button class="installed enabled confirm" data-type="configure">Configure</button>
                <button class="installed enabled" data-type="disable">Disable</button>
                <button class="installed not-enabled" data-type="enable">Enable</button>
                <button class="installed" data-type="uninstall">Remove</button>
                <button class="installed dev-mode" data-type="update">Update</button>
            </div>
        </div>  
    </div>

    <div class="hidden dev">
        <button id="launch-logging-window">Launch app logging window</button>
    </div>

    <div class="buffer">
    </div>
        
    <div class="footer" >
        <div class="copyright">
        %%LICENSE_WEB%%
        </div>
    </div>
</div>
<div class="emptyFooter">
</div>
</body>
</html>
